<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <p>基础语法：</p>
    <img src="../static/imgs/image.png" alt="" width="20%">

    <p>每个case最后都要写一个break</p>
    <p>注意，原本的switch语法中是没有break的说法的，
        但若不加break，遇到第一个符合case的块时，不仅执行该块内的语句，
        其后面的全部的case和default也都会被执行，加上break可以避免这一点
    </p>

    <p>如下图所示，不加break的输出将是：</p>
    <p>x等于1</p>
    <p>x等于2</p>
    <p>x等于其他值</p>

    <img src="./static/imgs/image copy.png" alt="" width="30%">

    <script>
        console.log("***练习开始***");
        
        var x = 2;
        switch (x) {
            case 1:
                console.log("x = 1");
                break;
            case 2:
                console.log("x = 2");
                break;
            case 3:
                console.log("x = 3");
                break;
            default:
                console.log("don't know the value of x.");
        }
        
        console.log("***练习结束***");
    </script>
</body>

</html>